export default {
    data() {
        return {
            x: 0,
            transition: false,
            width: 0,
            viewWidth: 0,
            swipeShow: 0
        };
    },
    watch: {
        show(newVal) {
            if (this.autoClose) return;
            if (newVal && newVal !== "none") {
                this.transition = true;
                this.open(newVal);
            } else {
                this.close();
            }
        }
    },
    created() {
        this.swipeaction = this.getSwipeAction();
        if (this.swipeaction && Array.isArray(this.swipeaction.children)) {
            this.swipeaction.children.push(this);
        }
    },
    mounted() {
        this.isopen = false;
        setTimeout(() => {
            this.getQuerySelect();
        }, 50);
    },
    methods: {
        appTouchStart(e) {
            const { clientX } = e.changedTouches[0];
            this.clientX = clientX;
            this.timestamp = new Date().getTime();
        },
        appTouchEnd(e, index, item, position) {
            const { clientX } = e.changedTouches[0];
            // fixed by xxxx 模拟点击事件，解决 ios 13 点击区域错位的问题
            let diff = Math.abs(this.clientX - clientX);
            let time = new Date().getTime() - this.timestamp;
            if (diff < 40 && time < 300) {
                this.$emit("click", {
                    content: item,
                    index,
                    position
                });
            }
        },
        /**
         * 移动触发
         * @param {Object} e
         */
        onChange(e) {
            this.moveX = e.detail.x;
            this.isclose = false;
        },
        touchstart(e) {
            this.transition = false;
            this.isclose = true;
            if (this.autoClose && this.swipeaction) {
                this.swipeaction.closeOther(this);
            }
        },
        touchmove(e) {},
        touchend(e) {
            // 0的位置什么都不执行
            if (this.isclose && this.isopen === "none") return;
            if (this.isclose && this.isopen !== "none") {
                this.transition = true;
                this.close();
            } else {
                this.move(this.moveX + this.leftWidth);
            }
        },

        /**
         * 移动
         * @param {Object} moveX
         */
        move(moveX) {
            // 打开关闭的处理逻辑不太一样
            this.transition = true;
            // 未打开状态
            if (!this.isopen || this.isopen === "none") {
                if (moveX > this.threshold) {
                    this.open("left");
                } else if (moveX < -this.threshold) {
                    this.open("right");
                } else {
                    this.close();
                }
            } else {
                if (moveX < 0 && moveX < this.rightWidth) {
                    const rightX = this.rightWidth + moveX;
                    if (rightX < this.threshold) {
                        this.open("right");
                    } else {
                        this.close();
                    }
                } else if (moveX > 0 && moveX < this.leftWidth) {
                    const leftX = this.leftWidth - moveX;
                    if (leftX < this.threshold) {
                        this.open("left");
                    } else {
                        this.close();
                    }
                }
            }
        },

        /**
         * 打开
         */
        open(type) {
            this.x = this.moveX;
            this.animation(type);
        },

        /**
         * 关闭
         */
        close() {
            this.x = this.moveX;
            // TODO 解决 x 值不更新的问题，所以会多触发一次 nextTick ，待优化
            this.$nextTick(() => {
                this.x = -this.leftWidth;
                if (this.isopen !== "none") {
                    this.$emit("change", "none");
                }
                this.isopen = "none";
            });
        },

        /**
         * 执行结束动画
         * @param {Object} type
         */
        animation(type) {
            this.$nextTick(() => {
                if (type === "left") {
                    this.x = 0;
                } else {
                    this.x = -this.rightWidth - this.leftWidth;
                }

                if (this.isopen !== type) {
                    this.$emit("change", type);
                }
                this.isopen = type;
            });
        },
        getSlide(x) {},
        getQuerySelect() {
            const query = uni.createSelectorQuery().in(this);
            query
                .selectAll(".movable-view--hock")
                .boundingClientRect((data) => {
                    this.leftWidth = data[1].width;
                    this.rightWidth = data[2].width;
                    this.width = data[0].width;
                    this.viewWidth = this.width + this.rightWidth + this.leftWidth;
                    if (this.leftWidth === 0) {
                        // TODO 疑似bug ,初始化的时候如果x 是0，会导致移动位置错误，所以让元素超出一点
                        this.x = -0.1;
                    } else {
                        this.x = -this.leftWidth;
                    }
                    this.moveX = this.x;
                    this.$nextTick(() => {
                        this.swipeShow = 1;
                    });

                    if (!this.buttonWidth) {
                        this.disabledView = true;
                    }

                    if (this.autoClose) return;
                    if (this.show !== "none") {
                        this.transition = true;
                        this.open(this.shows);
                    }
                })
                .exec();
        }
    }
};
